<style>
    .layui-form .layui-form-item .layui-inline .layui-form-label {
        width: 150px;
        font-size: 18px;
        font-weight: bold;
    }
    .layui-form .layui-form-item .layui-inline .layui-input-inline input{
        width: 400px;
        font-size: 17px;
    }
    .layui-form .layui-form-item .layui-inline .layui-input-inline textarea{
        width: 400px;
        font-size: 17px;
    }
</style>
<form class="layui-form  seller-alone-form" id="userAdd" style="padding:20px;height: 600px;">
    <fieldset class="layui-elem-field layui-field-title">
        <legend>
            <a href="{:url('index')}" style="color: #428bca;font-weight:bold;" >Setting Manage</a> / Edit
        </legend>
    </fieldset>
    <br/>
    <br/>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">Key：</label>
            <div class="layui-input-inline">
                <input type="text" value="{$data.key}" readonly name="key" id="key"
                       lay-verify="required_en" maxlength="100" style="border: 0px;"
                       lay-verType="tips"  class="layui-input">
            </div>
        </div>
    </div>
    {if $data.key == 'contact_us'
    || $data.key == 'server_desc'
    || $data.key == 'fund_desc'
    || $data.key == 'good_user_desc' }
    <div class="layui-form-item">
        <div class="layui-inline" >
            <label class="layui-form-label">Desc：</label>
            <div class="layui-input-inline" style="width: auto">
                    <textarea name="desc" style="padding-left: 2px;display: none;"
                     id="desc" class="layui-textarea">{$data.desc}</textarea>
            </div>
        </div>
    </div>
    {else}
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">Value：</label>
            <div class="layui-input-inline">
                <input type="text" name="value" value="{$data.value}" id="value"
                       lay-verify="required_en" maxlength="500"
                       lay-verType="tips"  class="layui-input">
            </div>
        </div>
    </div>
    {if $data.key == 'fund_server_img' }
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">&nbsp;</label>
            <div class="layui-input-inline">
                <button type="button" class="layui-btn" id="addBtn">
                    <i class="layui-icon">&#xe67c;</i>上传图片
            </div>
            <div class="layui-upload-list" id="photo-list" style="float: right">
                <img class="layui-upload-img" id="addPic" style="max-width: 150px;max-height: 200px"
                     src="{$data.value}">
                <p id="notice"></p>
            </div>
        </div>
    </div>
    {/if}
    <div class="layui-form-item">
        <div class="layui-inline" >
            <label class="layui-form-label">Desc：</label>
            <div class="layui-input-inline" style="width: auto">
                    <textarea name="desc" style="padding-left: 2px;"
                              class="layui-textarea">{$data.desc}</textarea>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">Is Encrypt：</label>
            <div class="layui-input-inline">
                <input type="radio" name="is_encrypt" value="0" title="No" {if $data.is_encrypt == 0}checked{/if}>
                <input type="radio" name="is_encrypt" value="1" title="Yes" {if $data.is_encrypt == 1}checked{/if}>
            </div>
        </div>
    </div>
    {if $data.key == 'oy_fund_user' }
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">Email Check：</label>
            <div class="layui-input-inline">
                <input style="width: 200px;" type="text" name="vercode" id="vercode" value=""  lay-verType="tips" placeholder="{:lang('vercode')}" class="layui-input" maxlength="6">
                <button style="width: 200px;" type="button" class="layui-btn layui-btn-fluid" id="getsmscode">Send Email Code</button>
            </div>
        </div>
    </div>
    {/if}
    <br/>
    <span style="padding-left: 200px;font-size: 20px;color:red">注意:修改需要加密的Value时,不要用加密过的提交，避免二次加密.</span>
    {/if}
    <div class="layui-form-item" style="padding-top: 100px;">
        <div class="layui-input-block">
            <input type="hidden" name="set_id" value="{$data.id}">
            <button type="button" class="layui-btn" lay-submit lay-filter="save">confirm</button>
            <a href="{:url('index')}" class="layui-btn layui-btn-primary">{:lang('back')}</a>
        </div>
    </div>
</form>

<script>
    layui.use(['form','layedit','upload'], function () {
        var form = layui.form;
        var layedit = layui.layedit;
        var editIndex = layedit.build('desc');

        form.on('submit(save)', function(data){
            if(data.field.key == 'contact_us'
                || data.field.key == 'server_desc'
                || data.field.key == 'fund_desc'
                || data.field.key == 'good_user_desc'
            ){
                data.field.desc = layedit.getContent(editIndex);
            }
            JsPost("{:url('setEdit')}", data.field, function(res){
                if (res.code > 0) {
                    layer.msg(res.msg, {time: 1500, icon: 1}, function () {
                        window.location.href = "{:url('index')}";
                    });
                } else {
                    layer.msg(res.msg, {time: 1500, icon: 2});
                }
            });
        });

        //普通图片上传
        var uploadInt = layui.upload.render({
            elem: '#addBtn',                //绑定元素
            url: '{:url("Uploads")}',       //上传接口
            //*********************传输限制
            size: 2048,                   //传输大小100k
            exts: 'jpg|png|gif',        //可传输文件的后缀
//            , accept: 'file'              //video audio images
            //****************传输操作相关设置
//            , data: { Parm1: "hello", Parm2: "world" }    //额外传输的参数
//            , auto: false                                 //自动上传,默认是打开的
//            , bindAction: '#btnUpload'                    //auto为false时，点击触发上传
            multiple: false,                            //多文件上传
            before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#addPic').attr('src', result); //图片链接（base64）
                });
            },
            done: function (res) {                      //传输完成的回调
                if(res.code>0){
                    //layer.msg('upload success',{icon: 1, time: 1500});
                    $('#value').val(res.img_url);
                }else{
                    //如果上传失败
                    layer.msg('upload error',{icon: 2, time: 1500});
                }
            },
            error: function () {                         //传输失败的回调
                //演示失败状态，并实现重传
                var notice = $('#notice');
                notice.html('<br /><span style="color: #FF5722;">upload error</span> ' +
                    '<a class="layui-btn demo-reload">retry</a>');
                notice.find('.demo-reload').on('click', function(){
                    uploadInt.upload();
                });
            }
        });

        var getCode = document.getElementById('getsmscode');
        var wait = 60;
        function time(btn){
            if (wait===0) {
                getCode.removeAttribute("disabled");
                getCode.innerHTML = "Send Email Code";
                wait = 60;
            }else{
                getCode.setAttribute("disabled",true);
                getCode.innerHTML = "<font color='black'>" + wait + " </font> Resend after";
                wait--;
                setTimeout(function(){
                    time(btn);
                },1000);
            }
        }
        getCode.onclick = function(){
            const loading =parent.layer.load(1, {shade: [0.1,'#fff']});
            $.post("{:url('emailSend')}", '', function (res) {
                parent.layer.close(loading);
                if (res.code > 0) {
                    time(this);
                    layer.msg('The verification code has been sent, please wait patiently.', {time: 1500, icon: 1});
                    $("#getsmscode").attr('disabled' , 'disabled');
                } else {
                    layer.msg(res.msg,{icon: 5, time: 1500});
                }
            });
        };
    });
</script>
